{% extends 'cms/base.html' %}
{% block title %}轮播图管理{% endblock %}
{% block head %}
<link rel="stylesheet" href="{% static 'css/cms/banner.min.css' %}">
<script src="{% static 'arttemplate/template-web.js' %}"></script>

<script id="banner-item" type="text/html">
    {% verbatim %}
    {{ if banner }}
        <div class="row banner-item" data-banner-id="{{ banner.id }}">
    {{ else }}
		<div class="row banner-item">
    {{ /if }}
		<div class="box-header">
            {{ if banner }}
			    <span class="priority">优先级：{{ banner.priority }}</span>
            {{ else }}
                <span class="priority">优先级：0</span>
            {{ /if }}
			<button class="btn btn-default btn-xs pull-right close-btn">
				<i class="fas fa-times"></i>
            </button>
        </div>
        <div class="col-md-12">
            <div class="box box-primary">
                <div class="box-body">
                    <div class="thumbnail-group">
                        <input type="file" style="display:none;" class="image-input">
                        {{ if banner }}
                            <img src="{{ banner.image_url }}" alt="Alternate Text" class="thumbnail">
                        {{ else }}
                            <img src="/static/images/banner.png" alt="Alternate Text" class="thumbnail">
                        {{ /if }}
                    </div>
                    <br>
                    <div class="form-group">
                        {{ if banner }}
                            <input type="text" class="form-control" name="priority" placeholder="优先级" value="{{ banner.priority }}">
                        {{ else }}
                            <input type="text" class="form-control" name="priority" placeholder="优先级">
                        {{ /if }}
                    </div>
                    <div class="form-group">
                        {{ if banner }}
                        <input type="text" class="form-control" name="link-to" placeholder="跳转链接" value="{{ banner.link_to }}">
                        {{ else }}
                        <input type="text" class="form-control" name="link-to" placeholder="跳转链接">
                        {{ /if }}
                    </div>
                </div>
            </div>
        </div>
        <div class="box-footer">
            <button class="btn btn-primary pull-right" id="save-btn">保存</button>
        </div>
    </div>
    {% endverbatim %}
</script>
<script src="{% static 'js/banners.min.js' %}"></script>
{% endblock %}
{% block content-header %}<h3>轮播图管理</h3>{% endblock %}
{% block content %}
<div class="row">
    <div class="col-md-12">
        <div class="box box-primary btn-group">
            <button class="btn btn-primary" id="add-banner-btn">
                <i class="fa fa-plus">
                    添加轮播图
                </i>
            </button>
        </div>
        <ul class="tips">
            <li>支持JPG，GIF，PNG格式，最多可上传6张</li>
            <li>比例4:1，宽度在800px上，5M以内</li>
        </ul>
    </div>
</div>
<div class="banner-list-group"></div>
{% endblock %}